// BUSS: 3 beers
Ext.ns('tj');

tj.SearchQueryPanel = Ext.extend(Ext.Panel, {

    initComponent: function () {
	this.padding = 10;
	this.width = 250;

	// search panel
	this.items = [{
	    // search button
	    xtype: 'container',
	    layout: {
		type: 'hbox',
		align: 'stretchmax'
	    },
	    items: [{
		xtype: 'spacer',
		flex: 1
	    },{
		xtype: 'button',
		text: '<b>Search!</b>',
		width: 110
	    }]
	    // search button
	},{
	    xtype: 'spacer',
	    height: 5
	},{
	    xtype: 'tj.collapsingform',
	    collapseText: 'Basic Info',
	    preCollapsed: false,
	    items: [{
		// Employer
		xtype: 'label',
		text: 'Employer:',
		style: 'font-size:13;color:grey;'
	    },{
		xtype: 'combo',
		width: 225,
		typeAhead: true,
		triggerAction: 'all',
		mode: 'local',
		value: 'Any',
		store: new Ext.data.ArrayStore({
		    fields: ['value'],
		    data: [['Reseach In Motion (RIM)'], ['BlueCoat'], ['Christie Digital']]
		}),
		valueField: 'value',
		displayField: 'value'	
		// Employer
	    },{
		xtype: 'spacer',
		height: 15
	    },{
		// Job Title
		xtype: 'label',
		text: 'Job Title:',
		style: 'font-size:13;color:grey;'
	    },{
		xtype: 'combo',
		width: 225,
		typeAhead: true,
		triggerAction: 'all',
		mode: 'local',
		value: 'Any',
		store: new Ext.data.ArrayStore({
		    fields: ['value'],
		    data: [['Any'],
			   ['Software Engineer'],
			   ['Software Developer'],
			   ['Software Tester'],
			   ['Caffinated Beverage Retrieval Specialist']]
		}),
		valueField: 'value',
		displayField: 'value'
		//Job Title
	    }]
	},{
	    xtype: 'spacer',
	    height: 5
	},{
	    xtype: 'tj.collapsingform',
	    collapseText: 'Location/Division',
	    preCollapsed: true,
	    items: [{
		// Location
		xtype: 'label',
		text: 'Location:',
		style: 'font-size:13;color:grey;'
	    },{
		xtype: 'combo',
		width: 225,
		typeAhead: true,
		triggerAction: 'all',
		mode: 'local',
		value: 'Any',
		store: new Ext.data.ArrayStore({
		    fields: ['value'],
		    data: [['Any'], ['Waterloo'], ['Toronto'], ['Columbia']]
		}),
		valueField: 'value',
		displayField: 'value'	
		// Location
	    },{
		xtype: 'spacer',
		height: 15
	    },{
		// Division
		xtype: 'label',
		text: 'Company Division:',
		style: 'font-size:13;color:grey;'
	    },{
		xtype: 'combo',
		width: 225,
		typeAhead: true,
		triggerAction: 'all',
		mode: 'local',
		value: 'Any',
		store: new Ext.data.ArrayStore({
		    fields: ['value'],
		    data: [['Any'],
			   ['Audio'],
			   ['Platform'],
			   ['Security'],
			   ['Urinal Cleaning']]
		}),
		valueField: 'value',
		displayField: 'value'
		// Division
	    },{
		xtype: 'spacer',
		height: 15
	    },{
		// Team
		xtype: 'label',
		text: 'Project Team:',
		style: 'font-size:13;color:grey;'
	    },{
		xtype: 'combo',
		width: 225,
		typeAhead: true,
		triggerAction: 'all',
		mode: 'local',
		value: 'Any',
		store: new Ext.data.ArrayStore({
		    fields: ['value'],
		    data: [['Any'],
			   ['Development'],
			   ['Research'],
			   ['QA'],
			   ['Project Management']]
		}),
		valueField: 'value',
		displayField: 'value'
		// Team
	    }]
	},{
	    xtype: 'spacer',
	    height: 5
	},{
	    xtype: 'tj.collapsingform',
	    collapseText: 'Experience',
	    preCollapsed: true,
	    items: [{
		// Disipline
		xtype: 'label',
		text: 'Disipline:',
		style: 'font-size:13;color:grey;'
	    },{
		xtype: 'checkboxgroup',
		width: 225,
		columns: 1,
		items: [
		    { boxLabel: 'Mechanical' },
		    { boxLabel: 'Electrical' },
		    { boxLabel: 'Computer/Electronic' },
		    { boxLabel: 'Low Level Software' },
		    { boxLabel: 'High Level Software' }
		]
		// Disipline
	    },{
		xtype: 'spacer',
		height: 15
	    },{
		// Term
		xtype: 'label',
		text: 'Term:',
		style: 'font-size:13;color:grey;'
	    },{
		xtype: 'combo',
		width: 225,
		typeAhead: true,
		triggerAction: 'all',
		mode: 'local',
		value: 'Any',
		store: new Ext.data.ArrayStore({
		    fields: ['value'],
		    data: [['Any'],
			   ['1A'],
			   ['1B'],
			   ['2A'],
			   ['2B'],
			   ['3A'],
			   ['3B'],
			   ['4A']]
		}),
		valueField: 'value',
		displayField: 'value'
		// Term
	    }]
	},{
	    xtype: 'spacer',
	    height: 5
	},{
	    // search button
	    xtype: 'container',
	    layout: 'hbox',
	    items: [{
		xtype: 'spacer',
		flex: 1
	    },{
		xtype: 'button',
		text: '<b>Search!</b>',
		width: 110
	    }]
	    // search button
	}];
	//search panel

	tj.SearchQueryPanel.superclass.initComponent.apply(this, arguments);
    }
});

Ext.reg('tj.searchquerypanel', tj.SearchQueryPanel);